// 从vue-router中导入创建路由所需的函数
import { createRouter, createWebHistory } from 'vue-router'

// 创建路由实例
const router = createRouter({
  // 使用HTML5历史模式，创建干净的URL（没有#）
  history: createWebHistory(),
  // 定义路由配置数组
  routes: [
    {
      // 根路径，对应首页
      path: '/',
      name: 'home',
      // 使用动态导入实现路由懒加载，提高首屏加载速度
      component: () => import('../views/Home.vue')
    },
    {
      // 导航页路径
      path: '/index',
      name: 'index',
      component: () => import('../views/Index.vue')
    },
    {
      // 文章列表页路径
      path: '/articles',
      name: 'articles',
      component: () => import('../views/Articles.vue')
    },
    {
      // 文章详情页路径，使用动态路由参数:id
      path: '/article/:id',
      name: 'article-detail',
      component: () => import('../views/ArticleDetail.vue')
    },
    {
      // 统一的文档页面路径
      path: '/docs/:category/:section?',
      name: 'documentation',
      component: () => import('../views/Documentation.vue'),
      props: true
    }
  ]
})

// 导出路由实例供main.ts使用
export default router